<!--
 * @Author: [you name]
 * @Date: 2021-11-07 22:27:03
 * @LastEditors: [you name]
 * @LastEditTime: 2021-11-08 15:11:27
 * @Description: 
-->
<template>
  <div class="log">
    <el-table :data="tabelData.list" size="small">
      <el-table-column type="index" label="序号"></el-table-column>
      <el-table-column prop="realname" label="名称"></el-table-column>
      <el-table-column prop="method" label="访问方式"></el-table-column>
      <el-table-column prop="content" label="访问路径"></el-table-column>
      <el-table-column prop="logTime" label="访问时间"></el-table-column>
    </el-table>

    <!-- 分页插件区域 -->
    <el-pagination
      background
      @size-change="handleSizeChange"
      @current-change="handleCurrentChange"
      :current-page="tabelData.page"
      :page-sizes="[5, 10, 15, 20]"
      :page-size="tabelData.size"
      layout="total, sizes, prev, pager, next"
      :total="tabelData.total"
    >
    </el-pagination>
  </div>

</template>

<script>
import request from '@/utils/request'
export default {
  data() {
    return {
      tabelData: {},
      queryParams: {
        page: 1,
        pageSize: 10,
      },
    };
  },
  methods: {
      baselog() {
          request
        .get("/baseLog/pageQuery", {
          params: this.queryParams,
        })
        .then((res) => {
          this.tabelData = res.data;
        });
      },
      // 分页size-change事件
    handleSizeChange(pageSize) {
      // 点击分页容量，将最新的pageSize设置到数据模型中
      this.queryParams.pageSize = pageSize;
      //   重新调用分页查询的方法，做数据重载
      this.baselog();
    },
    // 分页current-change事件
    handleCurrentChange(page) {
      this.queryParams.page = page;
      this.baselog();
    },
  },
  created() {
      this.baselog()
  }
};
</script>

<style>
</style>